<html ng-app="nameApp">
  <head>
    <meta charset="utf-8">
    <title>Jerry's One Order Trace tool using ABAP Channels</title>
    <script src="https://i042416.github.io/FioriODataTestTool2014/WebContent/angular/angular.js"></script>
    <script>
      var nameApp = angular.module('nameApp', []);
      nameApp.controller('NameCtrl', function ($scope){
      function getCurrentTime(){
         return new Date().toLocaleString();
      }
      (function init(){
        $scope.Ionames = ['Jerry\'s One order log tool'];
        var startTime = 'Trace Start Time:' + getCurrentTime();
        $scope.Ionames.push(startTime);
        var that = $scope;
        var sUrl = "wss://<>:44300/sap/bc/apc/sap/zorder_log_apc";
        var ws = new WebSocket(sUrl);
        var onMessage = function(evt){
            this.Ionames.push(getCurrentTime( ) + ':' + evt.data);
            this.$apply()
        };
        ws.onmessage = onMessage.bind($scope);
      })();
      });
    </script>
  </head>
  <body ng-controller="NameCtrl">
    <ul>
      <li ng-repeat="nameF in Ionames">{{nameF}}</li>
    </ul>
  </body>
</html>